<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@include file="/static/common/taglib.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <title>应急故障手册</title>
    <%@include file="../../public/commonJs.jsp" %>
    <%@include file="../../public/commonCss.jsp" %>
</head>
<body ms-controller="emergeBook">
<div id="wrapper">
    <div class="boxmain whiteBox lrbox contentbox8" style="padding-left: 50px">
        <div class="layui-form-item">
            <div class="layui-inline">
                <div class="layui-input-inline" style="width: 700px">
                    <input type="text" name="title"  placeholder="输入关键字" ms-duplex="searchKey"
                           data-duplex-changed="inputChange" class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <div class="layui-input-inline">
                    <button class="layui-btn layui-btn-small" onclick="loadSearchData()">搜索</button>
                </div>
            </div>
        </div>
        <div class="layui-tab" style="width: 800px">
            <ul class="layui-tab-title">
                <c:forEach items="${codeDatas}" var="t">
                    <li>${t.itemText}</li>
                </c:forEach>
            </ul>
            <div class="layui-tab-content" style="max-height: 700px;overflow: auto">
                <c:forEach items="${codeDatas}" var="t">
                    <div class="layui-tab-item">
                        <div class="layui-collapse">
                            <div class="layui-colla-item" ms-repeat="tableData"
                                 ms-if-loop="el.trainType=='${t.itemValue}'" data-duplex-renderd="selectText()">
                                <h2 class="layui-colla-title">{{el.name}}</h2>
                                <div class="layui-colla-content layui-show">{{el.contentHtml|html}}</div>
                            </div>
                        </div>
                    </div>
                </c:forEach>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    var vm = {
        tableData: [],
        searchKey: '',
        inputChange: function (value) {
            loadSearchData();
        }
    }
    vm = avalonFn.define("emergeBook", vm);
    $(function () {
        $(".layui-tab-title").children("li").eq(0).addClass("layui-this");
        $(".layui-tab-content").children(".layui-tab-item").eq(0).addClass("layui-show");
    })

    function loadSearchData() {
        var dataStr = {
            searchKey: vm.$model.searchKey
        };
        var url = "${ctx}/emergeBook/selectAll.action";
        ajaxUtil.post(url, dataStr, true, function (result) {
            vm.tableData = result.tableData;
        })
    }
</script>
</body>
</html>